﻿$.ui.dialog.defaults.bgiframe = true;
$.ui.dialog.defaults.draggable = false;
$.ui.dialog.defaults.stack = false;
$.ui.dialog.defaults.resizable = false;
$.ui.dialog.defaults.modal = true;
var currentEditElementID = null;
var currentScheduleID = null;

var SelectSubject = null;
var SelectTeacher = null;
var SelectBuilding = null;
var TextBoxRoom = null;

$(document).ready(function() {
    Initialize();
    $("#list").jqGrid({
        url: '../Group/GetSchedules',
        datatype: 'json',
        myType: 'GET',
        colNames: ['Id', 'Faculty', 'Department', 'Group', 'Year'],
        colModel: [
                         { name: 'Id', index: 'id', width: 55, resizable: true },
                         { name: 'Faculty', index: 'faculty', width: 250, resizable: true },
                         { name: 'Department', index: 'department', width: 150, resizable: true },
                         { name: 'Group', index: 'groupname', width: 90, resizable: true },
                         { name: 'Year', index: 'year', width: 200, resizable: true}],
        pager: $('#pager'),
        rowNum: 10,
        rowList: [10, 20, 30],
        sortname: 'id',
        sortorder: 'desc',
        viewrecords: true,
        multiselect: false,
        onSelectRow: getScheduleForGroup,
        imgpath: '../Image/jqGrid',
        caption: 'Schedules'
    });

});

function Initialize() {
    TextBoxRoom = document.getElementById("TextBoxRoom");
    SelectSubject = document.getElementById("SelectSubject");
    SelectTeacher = document.getElementById("SelectTeacher");
    SelectBuilding = document.getElementById("SelectBuilding");
    $("#Save").bind("click", save);
    $("#Cancel").bind("click", closePopup);
    var URL = "../Group/GetDataFroCreatingSchedule";
    $.getJSON(URL, function(data) {
        fillSelect(data.Subjects, SelectSubject);
        fillSelect(data.Teachers, SelectTeacher);
        fillSelect(data.Buildings, SelectBuilding);
    });
};

function fillSelect(data, selector) {
    for (var i = 0; i < data.length; i++) {
        var elOptNew = document.createElement('option');

        elOptNew.text = data[i].Name;
        elOptNew.value = data[i].ID;
        try {
            selector.add(elOptNew, null); // standards compliant; doesn't work in IE
        }
        catch (ex) {
            selector.add(elOptNew); // IE only
        }
    }
};
function getScheduleForGroup(id) {
    debugger;
    currentScheduleID = id;
    var URL = "../Group/GetScheduleForGroup/" + id;
    $.getJSON(URL, function(data) {
        $(".group-schedule")[0].style.display = "";
        var innerHTML = "";
        for (var i = 0; i < 6; i++) {
            innerHTML += "<tr>";
            innerHTML += "<td class='subjectTime'>";
            innerHTML += data.TimeSpaces[i];
            innerHTML += "</td>";
            innerHTML += "<td id='Monday_" + data.ClassesAtMonday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtMonday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "<td id='Tuesday_" + data.ClassesAtTuesday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtTuesday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "<td  id='Wednesday_" + data.ClassesAtWednesday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtWednesday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "<td  id='Thursday_" + data.ClassesAtThursday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtThursday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "<td  id='Friday_" + data.ClassesAtFriday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtFriday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "<td id='Saturday_" + data.ClassesAtSaturday[i].ID + "_" + i + "'>";
            innerHTML += data.ClassesAtSaturday[i].Subject;
            innerHTML += "</td>";
            innerHTML += "</tr>";

        }
        $("#classesTable")[0].innerHTML = innerHTML;
        var cells = $("#classesTable td");
        cells.bind("click", popup);
        cells.each(function() {
            this.style.cursor = 'pointer';
        });
    });
};

function popup(e) {
    currentEditElementID = this.id;
    $("#EditCreateDialog").dialog({
        close: closePopup,
        width: 400,
        height: 200
    });
};

function closePopup() {
    $('#EditCreateDialog').dialog("destroy");
};

function save() {
    debugger;
    var URL = "../group/SaveClass/" + currentEditElementID + "/" + SelectSubject.value + "/" + SelectTeacher.value + "/" + SelectBuilding.value + "/" + TextBoxRoom.value + "/" + currentScheduleID;
    $.getJSON(URL, function(data) {
        if (data.success) {
            closePopup();
            getScheduleForGroup(currentScheduleID);
        }
    });
};
